style: Add lockscreen style to entry drawing mixin

- include style condition to entry drawing mixin to accommodate transparent bg on lockscreen
- see https://gitlab.gnome.org/GNOME/gnome-shell/-/issues/6802 and https://gitlab.gnome.org/GNOME/gnome-shell/-/merge_requests/3109#note_1970652

Closes: https://gitlab.gnome.org/GNOME/gnome-shell/-/issues/7326
Part-of: <https://gitlab.gnome.org/GNOME/gnome-shell/-/merge_requests/3118>

diff --git a/data/theme/gnome-shell-sass/_common.scss b/data/theme/gnome-shell-sass/_common.scss
index 951fec0811366fe8e5f81ffb27f412ec5c87ea24..a14012f7e6e3d01d9d81aac20c2ae659f0834e14 100644 (file)
--- a/data/theme/gnome-shell-sass/_common.scss
+++ b/data/theme/gnome-shell-sass/_common.scss
@@ -360,3 +360,17 @@ stage {
   &:active { @include button(active, $tc:$system_fg_color, $c:$system_bg_color);}
   &:checked { @include button(checked, $tc:$system_fg_color, $c:$system_bg_color);}
 }
+
+/* Lockscreen Elements */
+
+// entries
+%lockscreen_entry {
+  @extend %entry_common;
+  @include entry(normal, $c:$system_fg_color, $style: lockscreen, $always_dark: true);
+  &:hover { @include entry(hover, $c:$system_fg_color, $style: lockscreen, $always_dark: true);}
+  &:focus { @include entry(focus, $c:$system_fg_color, $style: lockscreen, $always_dark: true);}
+  &:insensitive { @include entry(insensitive, $c:$system_fg_color, $style: lockscreen, $always_dark: true);}
+
+  StLabel.hint-text { color: transparentize($system_fg_color, 0.3);}
+}
+

diff --git a/data/theme/gnome-shell-sass/_drawing.scss b/data/theme/gnome-shell-sass/_drawing.scss
index ae9c02ff8fa036034527090029dc6108965ebb05..b95dbba885a9b46bfa4182157f9739b4dcfd928d 100644 (file)
--- a/data/theme/gnome-shell-sass/_drawing.scss
+++ b/data/theme/gnome-shell-sass/_drawing.scss
@@ -63,7 +63,7 @@
 }
 
 // Text entries drawing function
-@mixin entry($type, $c:$fg_color, $bc:$bg_color, $always_dark: false) {
+@mixin entry($type, $c:$fg_color, $bc:$bg_color, $style: null, $always_dark: false) {
   //
   // $type:         entry type, possible values: normal, focus, hover, insensitive
   // $c:            text color
@@ -71,8 +71,19 @@
   // $always_dark:  override the light theme check to use dark colors, true or false
   //
 
-  // background color
+  // entry colors
+  $entry_fg_color: $c;
   $entry_bg_color: mix($c, $bc, $background_mix_factor);
+  $entry_focus_color: $focus_color;
+
+  // entry color overrides for lockscreen style
+  @if $style == 'lockscreen' {
+    $entry_bg_color: transparentize($c, 0.95);
+    $entry_focus_color: transparentize($entry_fg_color, 0.6);
+    @if $contrast == 'high' {
+      $entry_focus_color: transparentize($entry_fg_color, 0.3);
+    }
+  }
 
   // background color adjustment factors
   // the % a color is lightened or darkened for button states
@@ -96,26 +107,32 @@
   // normal
   @if $type == 'normal' {
     background-color: $entry_bg_color;
-    color: transparentize($c,0.3);
+    color: transparentize($c, 0.3);
   }
 
   // focus styles
   @if $type == 'focus' {
     @include focus_ring();
     background-color: focus_bg_color($entry_bg_color);
-    color: $c;
+    color: $entry_fg_color;
+
+    // lockscreen style
+    @if $style == 'lockscreen' {
+      @include focus_ring($fc:$entry_focus_color);
+      background-color: focus_bg_color($entry_bg_color, $fc:$entry_focus_color);
+    }
   }
 
   // hover styles
   @if $type == 'hover' {
     background-color: $hover_entry_bg_color;
-    color: $c;
+    color: $entry_fg_color;
   }
 
   // insensitive styles
   @if $type == 'insensitive' {
     background-color: $insensitive_entry_bg_color;
-    color: transparentize($c, 0.5);
+    color: transparentize($entry_fg_color, 0.5);
   }
 }
 

diff --git a/data/theme/gnome-shell-sass/widgets/_login-lock.scss b/data/theme/gnome-shell-sass/widgets/_login-lock.scss
index 899ca6c3c4bee8d91041543e642505db73deb70a..ca9793173d06ffc34100332f7bd46993c920e355 100644 (file)
--- a/data/theme/gnome-shell-sass/widgets/_login-lock.scss
+++ b/data/theme/gnome-shell-sass/widgets/_login-lock.scss
@@ -5,6 +5,7 @@ $_gdm_dialog_width: 23em;
 // common style for gdm and lockscreen
 .login-dialog,
 .unlock-dialog {
+  color: $_gdm_fg;
 
   .caps-lock-warning-label,
   .login-dialog-message-warning {
@@ -155,9 +156,8 @@ $_gdm_dialog_width: 23em;
 .unlock-dialog {
   background-color: transparent;
 
-  // %system_entry style override to have neutral focus color with wallpaper background
   .login-dialog-prompt-entry {
-    &:focus { @include entry(focus, $c:$system_fg_color);}
+    @extend %lockscreen_entry;
   }
 }